<template>
    <div>
      <div>
        <el-form :inline="true"  class="demo-form-inline">
          <el-form-item label="影片" >
            <el-input v-model="queryMname" style="width:90px" type="text" placeholder="请输入电影"></el-input>
          </el-form-item >
           <el-form-item label="影厅" >
            <el-input v-model="queryHname" style="width:90px"  type="text" placeholder="请输入影厅"></el-input>
          </el-form-item>
           <el-form-item label="影院"  >
              <el-select v-model="id" placeholder="请选择" style="width:180px">
                <el-option         
                    value="">请选择  
                </el-option>
                <el-option
                    v-for="item in options"
                    :key="item.id"
                    :label="item.cname"
                    :value="item.id">  
                </el-option>
              </el-select>
            开始时间 
            <el-date-picker  
                v-model="queryStime" 
                label="开始时间" placeholder="开始时间" 	
                type="datetime"
                format="yyyy-MM-dd HH:mm:ss"
                value-format="yyyy-MM-dd HH:mm:ss" style="width:190px">
              </el-date-picker>
              结束时间  
              <el-date-picker  
                v-model="queryEtime" 
                label="结束时间" placeholder="结束时间" 	
                type="datetime"
                format="yyyy-MM-dd HH:mm:ss"
                value-format="yyyy-MM-dd HH:mm:ss" style="width:190px">
              </el-date-picker>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="onSubmit">查询</el-button>
          </el-form-item>
		    <el-button type="primary" @click="addSchedule" >添加影片</el-button>

        <el-button type="primary" @click="queryScheduleStatus" >修改排片状态</el-button>
        </el-form>
      </div>
      <div>
      </div>
      <div>

        <el-dialog title="" :visible.sync="dialogFormVisible">
          <el-form ref="form" v-model="schedule" label-width="80px">
 
            <el-form-item label="影厅">
              <el-input v-model="schedule.hallId"  ></el-input>
            </el-form-item>

            <el-form-item label="电影名">
              <el-input v-model="schedule.movieId"></el-input>
            </el-form-item>

            &nbsp;&nbsp;开始时间:&nbsp;
            <el-date-picker 
            v-model="schedule.startTime"   @blur="compare(schedule.startTime,schedule.endTime)" style="width: 87%" 
            placeholder="选择日期"
            type="datetime"
            format="yyyy-MM-dd HH:mm:ss"
            value-format="yyyy-MM-dd HH:mm:ss">
            </el-date-picker>
            <br /><br />

                  &nbsp;&nbsp;结束时间:&nbsp;&nbsp;
            <el-date-picker 
            v-model="schedule.endTime"  @blur="compare2(schedule.startTime,schedule.endTime)" style="width: 87%" 
            placeholder="选择日期"
            type="datetime"
            format="yyyy-MM-dd HH:mm:ss"
            value-format="yyyy-MM-dd HH:mm:ss">
            </el-date-picker>
                  <br /><br />

            <el-form-item label="价格">
              <el-input v-model="schedule.price"></el-input>
            </el-form-item>

            <el-form-item>
              <el-button type="primary" @click="save">保存</el-button>
              <el-button >取消</el-button>
            </el-form-item>
          </el-form>
        </el-dialog>
      </div>

      <div >
      
          <el-table
          ref="multipleTable"
          :data="tlist"
          tooltip-effect="dark"
          style="width: 100%"
          @selection-change="handleSelectionChange">
          <el-table-column
          type="selection"
          width="50">
        </el-table-column>
        <el-table-column
            label="编号"
            width="50"
            prop="id"
    			>
          </el-table-column>
          <el-table-column
            label="影厅"
            width="80"
            prop="hname"
			>
          </el-table-column>
          <el-table-column
            label="电影"  
            width="150"
            prop="mname">
          </el-table-column>
         
         <el-table-column
            label="影院"
            width="150"
            prop="cname">
          </el-table-column>

          <el-table-column
            label="开始时间"
            width="150"
            prop="startTime" 
			type="datetime"
			format="yyyy-MM-dd HH:mm:ss"
			>
          </el-table-column>
			
          <el-table-column
            label="结束时间"
            width="150"
            prop="endTime"
			placeholder="选择日期"  
			type="datetime"  
		
			format="yyyy-MM-dd HH:mm:ss">
          </el-table-column>
		   <el-table-column
            label="价格"
            width="70"
            prop="price">
          </el-table-column>
            <el-table-column
            label="状态"
            width="70"
            >
            <template slot-scope="scope">
              {{scope.row.status=='1'?'上映':'过期'}}
            </template>
          </el-table-column>
          <el-table-column label="操作"  width="240">
            <template slot-scope="scope" >
              <el-button
                size="mini"
                @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
              <el-button
                size="mini"
                type="danger"
                @click="handleDelete(scope.$index, scope.row)">删除</el-button>
                <el-button
                size="mini"
                type="primary"
                @click="handleStatus(scope.$index, scope.row)">设置过期</el-button>
            </template>
          </el-table-column>
        </el-table>
  
      </div>

      <div class="block" style="text-align: center">
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="now"
          :page-sizes="[2, 4, 8, 16]"
          :page-size="size"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total">
        </el-pagination>
      </div>
     
    </div>
</template>

<script>
  export default {
		name: "UpdateHallMovie",
    data(){
      return {
            queryHname:'',
            queryMname:'',
            queryCname:'',
            queryStime:'',
            queryEtime:'',
            now:1,
            size:2,
            total:0,
            value:'',
            options: [],
            id:'',
            cname:'',
		    	   tlist: [],
            scheduleVo:"",
            updateTime:"",
            dialogFormVisible:false,
            gettime:"",
            schedule:{
			        id:0,
              hallId:0,
              movieId:0,
              startTime:new Date(""),
              endTime:new Date(""),
              status:0,
              price: 0,
			        mname:'',
			        hname:''
            },
		};
		 
		},
    mounted:function () {
          this.onSubmit();
          this.queryShowMovie();
          this.init;          
    },

    methods:{
      handleSelectionChange(val) {
        this.multipleSelection = val;
      },

      queryShowMovie(){           
            this.$axios.get("http://localhost:8080/admin/cinema/cinema",{              
            }).then(data=>{
                console.log(data);               
                this.options=data.data.data;             
            });
      },

			compare(date1,date2) {
        let dates1 = new Date(date1);
        let dates2 = new Date(date2);
        if (dates1 > dates2) {
          alert("开始时间不能大于结束时间");
          this.schedule.startTime = "";
			  }
      },
      
			compare2(date1,date2) {
        let dates1 = new Date(date1);
        let dates2 = new Date(date2);
        if (dates1 > dates2) {
          alert("结束时间不能小于开始时间")
          this.schedule.endTime = ""
        }
      },

      save(){
        //console.log(this.schedule.id>0);
        if (this.schedule.id>0){
          let flag1 = false;
          let flag2 = false; 
          let flag3 = false;       
          this.$axios.get("http://localhost:8080/admin/schedule/selectScheduleVoByKey",{
                  params:{
                    hallId:this.schedule.hallId, 
                    scheduleId:this.scheduleId                 
                  }
                }).then(data=>{
                  console.log(data.data.data);                
                  var slist = data.data.data;                            
                  let dates1 = new Date(this.schedule.startTime);
                  let dates2 = new Date(this.schedule.endTime);
                  //console.log(slist);
                  slist.forEach(element => {
                      //console.log(element);
                      if(dates1>new Date(element.startTime)&&dates1<new Date(element.endTime)){
                                    alert("开场时间错误");
                                    flag1 = true;
                      }
                      if(dates2<new Date(element.endTime)&&dates2>new Date(element.startTime)){
                                    alert("结束时间错误");
                                    flag2 = true;
                      }
                      if(dates2>new Date(element.endTime)&&dates1<new Date(element.startTime)){
                                    alert("时间段内有排片计划");
                                    flag3 = true;
                      }
                  });
                  if(!flag3&&!flag2&&!flag1){
                        this.$axios.put("http://localhost:8080/admin/schedule/updateSchedule", {        
                            id:this.schedule.id,
                            hallId:this.schedule.hallId,
                            movieId:this.schedule.movieId,
                            startTime:this.schedule.startTime,
                            endTime:this.schedule.endTime,
                            price:this.schedule.price
                        }).then(data => {      
                          if (data.data.code == 200) {            
                            alert(data.data.msg);
                            this.dialogFormVisible = false;
                            this.init();
                          } else {
                            alert(data.data.msg);
                          }
                        })
                  }        
          })         
          
        }else{
          //console.log(new Date(this.schedule.startTime).toJSON());
          //console.log(new Date(this.schedule.startTime));
          // let date1 = new Date(this.schedule.startTime).toJSON().split('T')[0]+" "
          // +new Date(this.schedule.startTime).toJSON().split('T')[1].split('.')[0];
          // console.log(new Date());
          // console.log(new Date().toJSON());
          // let date2 = new Date(this.schedule.endTime).toJSON().split('T')[0]+" "
          // +new Date(this.schedule.endTime).toJSON().split('T')[1].split('.')[0];
          let flag1 = false;
          let flag2 = false; 
          let flag3 = false;       
          this.$axios.get("http://localhost:8080/admin/schedule/selectScheduleVoByKey",{
                  params:{
                    hallId:this.schedule.hallId,
                    scheduleId:0                  
                  }
                }).then(data=>{
                  console.log(data.data.data);                
                  var slist = data.data.data;                            
                  let dates1 = new Date(this.schedule.startTime);
                  let dates2 = new Date(this.schedule.endTime);
                  //console.log(slist);
                  slist.forEach(element => {
                      //console.log(element);
                      if(dates1>new Date(element.startTime)&&dates1<new Date(element.endTime)){
                                    alert("开场时间错误");
                                    flag1 = true;
                      }
                      if(dates2<new Date(element.endTime)&&dates2>new Date(element.startTime)){
                                    alert("结束时间错误");
                                    flag2 = true;
                      }
                      if(dates2>new Date(element.endTime)&&dates1<new Date(element.startTime)){
                                    alert("时间段内有排片计划");
                                    flag3 = true;
                      }
                  });
                  if(!flag3&&!flag2&&!flag1){
                        this.$axios.post("http://localhost:8080/admin/schedule/insertScheduleVo", {
                            id:this.schedule.id,
                            hallId:this.schedule.hallId,
                            movieId:this.schedule.movieId,
                            startTime:this.schedule.startTime,
                            endTime:this.schedule.endTime,
                            price:this.schedule.price
                        }).then(data => {
                          if (data.data.code == 200) {
                            alert(data.data.msg);
                            this.dialogFormVisible = false;
                            this.init();
                          } else {
                            alert(data.data.msg);
                          }
                        });
                  }        
          })
        } 
      },

      addSchedule(){
        this.dialogFormVisible=true;
        this.schedule={};
        //this.schedule.startTime=new Date("yyyy-MM-dd HH:mm:ss");
        //this.schedule.endTime=new Date("yyyy-MM-dd HH:mm:ss");
      },

      queryScheduleStatus(){
          this.$axios.get("http://localhost:8080/admin/schedule/ScheduleStatus")
                .then(data=>{
                  console.log(data.data);
                  if(data.data.code==200){
                    alert("修改成功");
                    this.onSubmit();
                  }else{
                    alert("修改失败")
                  }
                })
      },
				  
      onSubmit(){
        this.now = 1;
        this.size = 8 ;
        this.init();
      },

      init(){
        this.$axios.get("http://localhost:8080/admin/schedule/queryschedule",{
          params:{
            hname:this.queryHname,
            cid:this.id,
            mname:this.queryMname,
            startTime:this.queryStime,
            endTime:this.queryEtime,
            pageNum: this.now,
            pageSize:this.size
          }
        }).then(data=>{
          if (data.data.code == 200) {                
            this.now = data.data.data.pageNum;
            this.size = data.data.data.pageSize;
            this.tlist = data.data.data.list ;
            this.total = data.data.data.total;			
          }else {
            this.$layer.alert(data.data.msg)
          }
        })
      },

      handleEdit(index, row) {
        this.dialogFormVisible=true;
        this.$axios.get("http://localhost:8080/admin/schedule/selectScheduleVoByPrimaryKey/"+row.id)
          .then(data=>{
              this.schedule=data.data.data;                
            })
      },

      handleDelete(index, row) {
        this.$axios.delete("http://localhost:8080/admin/schedule/deleteByPrimaryKey/"+row.id)
          .then(data=>{
              if(data.data.code==200){
                alert("删除成功!!");
                this.init();
              }else {
                alert("删除失败!!");

              }
            }
          )
      },

      handleStatus(index, row){
            var nowD = new Date(), //当前时间
            endD = new Date(row.endTime); //对比时间    
            if(row.status==0){
              alert("过期");                   
            }else if(nowD.getTime()>endD.getTime()){                   
                this.$axios.put("http://localhost:8080/admin/schedule/updateStatus", {
                  id:row.id
                }).then(data => {
                  if (data.data.code == 200) {
                    this.tlist.status = data.data.data.status
                    this.init();
                  } else {
                    alert(data.data.msg)
                  }
                });          
            }
      },

      handleSizeChange(val) {        
        this.size = val;
        this.init();
      },

      handleCurrentChange(val) {        
        this.now = val ;
        this.init();
      }
    }
  }
</script>

<style scoped>
  .avatar-uploader .el-upload {
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
  }
  .avatar-uploader .el-upload:hover {
    border-color: #409EFF;
  }
  .avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    width: 178px;
    height: 178px;
    line-height: 178px;
    text-align: center;
  }
  .avatar {
    width: 178px;
    height: 178px;
    display: block;
  }
</style>
